/*
 * @Author: yangrongxin
 * @Date: 2021-08-02 17:18:06
 * @LastEditors: yangrongxin
 * @LastEditTime: 2021-09-06 19:47:48
 */

import { useState, useRef } from 'react';
import { View, ScrollView } from '@tarojs/components';
import { NavBarSearch, EvaluationClass, CLASS_TYPE, ScrollContent } from '@/components/index';
import { RenderItemComponent } from './components';
import { getArticleList } from './service';
import styles from './index.module.less';

const PatientEducation = () => {
  const scrollContentRef = useRef<any>();

  const [curModuleCode, setCurModuleCode] = useState<string>(''); // 存储当前选择的分类模块编码

  const [refresherTrigger, setRefresherTrigger] = useState<boolean>(false);
  const classEleRef = useRef<any>();

  return (
    <ScrollView
      scrollWithAnimation
      scrollY
      refresherEnabled
      onRefresherRefresh={() => {
        setRefresherTrigger(true);
        classEleRef?.current?.reload();
        scrollContentRef?.current?.reload(
          {
            moduleCode: curModuleCode,
          },
          true,
        );
      }}
      refresherTriggered={refresherTrigger}
    >
      <View className="hxtPublicWapper">
        <NavBarSearch />
        <EvaluationClass
          ref={classEleRef}
          type={CLASS_TYPE.HUANJIAO}
          onChange={(moduleCode: string) => {
            setCurModuleCode(moduleCode);
            scrollContentRef?.current?.reload(
              {
                moduleCode,
              },
              true,
            );
            console.log('curModuleCode', moduleCode);
          }}
        />
        <ScrollContent
          enabledRefresh={false}
          request={async (data) => getArticleList(data)}
          ref={scrollContentRef}
          params={{
            moduleCode: curModuleCode,
          }}
          ScrollItem={RenderItemComponent}
          extendScrollContentWapper={styles.extendScrollContentWapper}
          extendScrollContent={styles.extendScrollContent}
          onDataFetch={() => setTimeout(() => setRefresherTrigger(false), 200)}
        />
      </View>
    </ScrollView>
  );
};

export default PatientEducation;
